
import { Suspense, FC } from "react";

import {

    Navigate,
    Routes,
    Route,
    BrowserRouter as Router,
    HashRouter
} from "react-router-dom";
import routerConfig from "./routerConfig";
import { RouteListItem } from "../utils/types";




function renderRoute(routes: RouteListItem[]) {
    return routes?.map((item,index) => {
        return <Route
            key={index}
            path={item.path}
            element={item.redirect?<Navigate to={item.redirect}/>:<item.component/>}
        >   
            {
                item.children && renderRoute(item.children)
            }
        </Route>
    })
}





let RouterView: FC = () => {
    const { mode = "history", routes } = routerConfig;
    return (
        <Suspense fallback="正在加载中。。。。。">
            {
                mode === "history" ? <Router>
                    <Routes>
                        {
                            renderRoute(routes)
                        }
                    </Routes>
                </Router> : <HashRouter>
                    <Routes>
                        {
                            renderRoute(routes)
                        }
                    </Routes>
                </HashRouter>
            }
        </Suspense>
    )
};


export default RouterView;





